import { createRouter, createWebHashHistory } from 'vue-router'
import Layout from '@/layout'

const routerHistory = createWebHashHistory()
/**
 * meta 当children内只有一项时可以不设置，默认使用第一项，多项时必须设置
 * hidden 是否显示
 * roles 权限名单
*/
export const constantRoutes = [
  {
    path: '/login',
    hidden: true,
    component: () => import('@/view/login/index.vue'),
  },
  {
    path: '/404',
    hidden: true,
    component: () => import('@/view/error/404.vue'),
  },
  {
    path: '/',
    component: Layout,
    redirect: '/index',
    children: [{
      path: 'index',
      name: 'index',
      component: () => import('@/view/index.vue'),
      meta: { title: '首页', icon: 'el-icon-location' },
    }]
  },
  {
    path: '/form4',
    name: 'form4',
    component: Layout,
    children: [
      {
        path: 'index',
        name: 'Form24',
        component: () => import('@/view/form/index.vue'),
        meta: { title: '表单', icon: 'el-icon-setting' }
      }
    ]
  },
  {
    path: '/table',
    name: 'table',
    component: Layout,
    redirect: '/table/index',
    meta: { title: '表格', icon: 'el-icon-location' },
    children: [
      {
        path: 'index',
        name: 'Form3',
        component: () => import('@/view/table/index.vue'),
        meta: { title: 'table', icon: 'el-icon-menu' }
      },
      {
        path: 'index1',
        name: 'Form4',
        component: () => import('@/view/form/index.vue'),
        meta: { title: 'tab-Form', icon: 'el-icon-setting' }
      },
      {
        path: 'index1-1',
        component: () => import('@/view/form/index.vue'),
        meta: { title: 'tab-Form', icon: 'el-icon-setting' },
        children: [
          {
            path: 'index1',
            name: 'Form31',
            component: () => import('@/view/table/index.vue'),
            meta: { title: 'table', icon: 'el-icon-menu' }
          },
          {
            path: 'index11',
            name: 'Form41',
            component: () => import('@/view/form/index.vue'),
            meta: { title: 'tab-Form', icon: 'el-icon-setting' }
          },
        ]
      }
    ]
  }
]
export const asyncRoutes = [
  {
    path: '/article',
    name: 'article',
    component: Layout,
    redirect: '/article/create',
    meta: { title: '文章', icon: 'el-icon-setting' },
    children: [
      {
        path: 'create',
        name: 'create',
        component: () => import('@/view/article/create'),
        meta: { title: '文章创建', icon: 'el-icon-setting' }
      },
      {
        path: 'list',
        name: 'list',
        component: () => import('@/view/article/list'),
        meta: { title: '文章列表', icon: 'el-icon-setting' }
      },
      {
        path: 'info',
        name: 'info',
        hidden: true,
        component: () => import('@/view/article/info'),
        meta: { title: '文章详情', icon: 'el-icon-setting' }
      }
    ]
  },
  { path: '/:catchAll(.*)', redirect: '/404', hidden: true }
]
// hidden true 隐藏
const router = createRouter({
  history: routerHistory,
  scrollBehavior: () => ({ y: 0 }),
  routes: constantRoutes
})

export function resetRouter() {
  const newRouter = createRouter()
  router.matcher = newRouter.matcher // reset router
}
export default router